import { ref, computed } from 'vue'
import { DealType } from '@/config/constants'
import useSuccess from '@/hooks/useSuccess'
import storage, { get } from 'good-storage'

const useFlawColums = () => {
    const columns = [
        {
            attrs: {
                type: 'selection',
                selectable: row => {
                    console.log(row.status)
                    return row.status === 1
                },
                'reserve-selection': true
            }
        },
        {
            slot: 'number',
            attrs: {
                label: '编号',
                width: '160',
                'show-overflow-tooltip': true
            }
        },
        {
            attrs: {
                label: '巡查类型',
                prop: 'typeName',
                'show-overflow-tooltip': true,
                'min-width': '160'
            }
        },
        {
            attrs: {
                label: '巡查部门',
                prop: 'deptName',
                'show-overflow-tooltip': true,
                'min-width': '160'
            }
        },
        {
            attrs: {
                label: '缺陷病害类型',
                prop: 'defectDiseaseType',
                'show-overflow-tooltip': true,
                'min-width': '130'
            }
        },
        {
            attrs: {
                label: '巡查日期',
                prop: 'inspectDate',
                width: '130',
                'show-overflow-tooltip': true
            }
        },
        {
            attrs: {
                label: '公路名称',
                prop: 'highwayName',
                width: '120',
                'show-overflow-tooltip': true
            }
        },
        {
            attrs: {
                label: '位置类型',
                prop: 'locationTypeName',
                width: '140',
                'show-overflow-tooltip': true
            }
        },
        {
            attrs: {
                label: '位置/桩号',
                prop: 'location',
                width: '160',
                'show-overflow-tooltip': true
            }
        },
        {
            attrs: {
                label: '问题描述',
                prop: 'abnormalDescription',
                'show-overflow-tooltip': true,
                'min-width': '140'
            }
        },
        {
            slot: 'status',
            attrs: {
                label: '状态',
                prop: 'statusName',
                width: '120',
                'show-overflow-tooltip': true
            }
        },
        {
            slot: 'action',
            attrs: {
                label: '操作',
                fixed: 'right',
                width: '340'
            }
        }
    ]
    return {
        columns
    }
}

const useFlawsAction = (context, getList) => {
    const { $route: _route, $router: _router, $store } = context
    let id = null
    const notes = ref(null)
    const notesDialog = ref(false)
    const dialogVisible = ref(false)
    // 列表处理记录弹窗配置
    const formItems = [
        {
            type: 'textarea',
            // model: 'processingRecords',
            model: 'handleRecord',
            maxlength: 300,
            autosize: { minRows: 6, maxRows: 10 },
            label: '处置结果'
        },
        {
            type: 'imageUpload',
            model: 'photos',
            label: '图片上传'
        }
    ]
    const dialogRules = {
        handleRecord: [
            {
                required: true,
                message: '处理记录不能为空',
                trigger: ['blur']
            }
        ]
    }
    const multipleSelection = ref([])
    const dialogForm = ref({})
    const disable = computed(() => multipleSelection.value.length === 0)
    // 新增缺陷
    const handleAdd = () => {
        _router.push({
            name: 'AddFlawRecord'
        })
    }
    const handleClickNumner = row => {
        storage.set('flawInfo', row)
        _router.push({
            name: 'FlawDetail',
            query: {
                id: row.id
            }
        })
    }
    const handleViewRecords = row => {
        notes.value = row.processingRecords
        notesDialog.value = true
    }
    const handleOpenDialogForm = row => {
        dialogVisible.value = true
        id = row.id
        dialogForm.value = {}
    }

    const gotoProjectDetail = row => {
        _router.push({
            name: 'MaintenanceProjectDetail',
            query: {
                number: row.projectCode
            }
        })
    }

    // 创建单个养护工程工单
    const handleCreateOrder = row => {
        // 这里用path，直接用name会导致跳转到首页，无法重定向404
        let name = ''
        if (row.mainType === 'main') {
            name = 'MaintenanceProjectAdd'
        }
        if (row.mainType === 'task') {
            name = 'DailyMaintenanceTaskAdd'
        }
        _router.push({
            name,
            query: {
                source: _route?.name
            }
        })
        storage.set('flaws', [row])
    }
    // 批量生成工单
    const handleMultipleSelection = type => {
        let name = ''
        if (type === 'main') {
            name = 'MaintenanceProjectAdd'
        }
        if (type === 'task') {
            name = 'DailyMaintenanceTaskAdd'
            // 如果所选缺陷来自不同公路禁止跳转
            const higways = new Set(multipleSelection.value.map(el => el.highwayCode))
            if (Array.from(higways).length > 1) {
                context.$message.warning('只能选择同一条公路的缺陷病害')
                return false
            }
        }
        _router.push({
            name,
            query: {
                source: _route?.name
            }
        })
        storage.set('flaws', multipleSelection.value)
    }
    const handleSelectionChange = val => {
        multipleSelection.value = val
    }

    const submitFlawRecord = async valid => {
        if (valid) {
            // 若没有执行id的赋值代码，则娶不到id，这里判断若没有则从路由中取id
            id = id || _route.query.id
            const data = {
                id: id,
                ...dialogForm.value
                // dealType: DealType.SCENE
            }
            await $store.dispatch('inspect-result/submitFlawRecord', data)
            dialogVisible.value = false
            useSuccess({ onlyTip: true })
            // 详情页中没有传getlist 所以会报错，下边分别为列表的和详情页的
            if (getList) {
                getList()
            } else {
                $store.dispatch('inspect-result/detail', id).then(res => {
                    storage.set('flawInfo', res) // 重新缓存数据
                    window.location.reload() // 刷新，使得获取新的数据
                })
                // 现在达到数据更新的目的了，也不知道冗不冗余
            }
        }
    }
    return {
        notes,
        notesDialog,
        dialogVisible,
        formItems,
        dialogForm,
        dialogRules,
        multipleSelection,
        disable,
        handleAdd,
        handleClickNumner,
        handleViewRecords,
        handleOpenDialogForm,
        gotoProjectDetail,
        handleCreateOrder,
        handleMultipleSelection,
        handleSelectionChange,
        submitFlawRecord
    }
}

export { useFlawsAction, useFlawColums }
